<!--
 * @Author: zhi1hw hanwei@zhi1tech.com
 * @Date: 2024-06-18 10:32:15
 * @LastEditors: zhi1hw hanwei@zhi1tech.com
 * @LastEditTime: 2024-09-13 00:38:38
 * @FilePath: \code\src\App.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<script setup lang="ts">
import { themeStore, ITheme } from "./store/modules/theme";
const themeColor: ITheme = themeStore().theme;
import {
  ComponentInternalInstance,
  getCurrentInstance,
  inject,
  onMounted,
  onUnmounted,
  reactive,
  watch,
  defineProps,
  provide,
} from "vue";
// 获取当前主题
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

provide("themeColor", themeColor);
const state = reactive({
  isLoadEnd: false,
});

const isMobile = function () {
  const userAgent = navigator.userAgent.toLowerCase();
  return /iphone|ipod|android|windows phone|blackberry|bb10|mobi|xoom|tablet|mobile/i.test(
    userAgent
  );
};

const detectZoom = function () {
  let ratio = 0,
    screen = window.screen,
    ua = navigator.userAgent.toLowerCase();
  if (window.devicePixelRatio !== undefined) {
    ratio = window.devicePixelRatio;
  } else if (~ua.indexOf('msie')) {
    if (screen.deviceXDPI && screen.logicalXDPI) {
      ratio = screen.deviceXDPI / screen.logicalXDPI;
    }
  } else if (
    window.outerWidth !== undefined &&
    window.innerWidth !== undefined
  ) {
    ratio = window.outerWidth / window.innerWidth;
  }
  if (ratio) {
    ratio = Math.round(ratio * 100);
  }
  const zoomLevel = window.devicePixelRatio;

  if (zoomLevel === 1.25) {
    return ratio * 1.3;
  } else if (zoomLevel === 1.5) {
    return ratio * 1.3;
  } else {
    return ratio * 1;
  }

};


onMounted(() => {
  if (isMobile()) {
    location.href = process.env.VUE_APP_CHART;
  } else{
    // const m = detectZoom();
    // document.body.style.zoom = 100 / Number(m);
  }
});
</script>

<template>
  <div>
    <router-view> </router-view>
  </div>
</template>
<style lang="scss">
*{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
a {
  color: #5cb2ff;
}
</style>
